<template>
  <div class="home-header">
    <slot name="login-back"></slot>
    <slot name="login-logo">
      <div class="site-info">
        <h1 @click="goBack">手机网易</h1>
      </div>
    </slot>
    <slot name="go-home"></slot>
    <slot name="news-detail"></slot>
    <slot name="header-search"></slot>
    <slot></slot>
  </div>
</template>
<script>
export default {
  name: "Header",
  components: {},
  methods: {
    goBack() {
      this.$router.back();
    },
  },
};
</script>
<style scoped lang="less">
.home-header {
  display: flex;
  align-items: center;
  padding-left: 20px;
  height: 50px;
  background-color: #ef4645;
  .site-info {
    h1 {
      background: url("@/assets/image/logo.png") no-repeat 50%;
      background-size: 100% 100%;
      margin-right: 10px;
      color: #fff;
      font-size: 0;
      height: 22px;
      width: 46px;
    }
  }
}
</style>
